<template>
	<view :class="currentTheme">
		<a-nabbar name="评价管理" />
		<mescroll-body @init="mescrollInit" @down="downCallback" @up="upCallback">
			<view class="u-padding-left-32 u-padding-right-32 u-padding-top-20">
				<view v-for="(item,index) in dataList" :key="index" class="u-padding-bottom-20">
					<item-box :padding="20">
						<view class="u-padding-top-20 u-padding-bottom-20">
							<userHeader :form.sync="item">
								<view class="chat-btn u-position-relative"  @click="singchat(item)">
									<item-btn width="140" height="70">
										<text class="u-font-24">私聊TA</text>
									</item-btn>
								</view>
								<view class="u-flex" slot="content">
									<star :score="item.storeScore"></star>
								</view>
							</userHeader>
							<view class="u-flex u-col-top">
								<view style="width: 100rpx;height: 100rpx;"></view>
								<view class="u-flex-1 u-margin-left-24">
									<view class="u-font-20 text-tips u-text-right u-padding-bottom-20">{{item.addTime | dayFormat}}</view>
									<!-- <userLevel :item="item.userGameLevel" v-if="item.userGameLevel"></userLevel> -->
									<view class="u-font-24 text-order-time">{{item.content}}</view>
									<view class="u-padding-top-30" v-if="item.imgs&&item.imgs[0] !==''">
										<u-row :gutter="10">
											<u-col :span="item.imgs.length>2 ? 4 :6" v-for="(c,i) in item.imgs" :key="i"
												class="u-margin-bottom-8 col-image-box">
												<item-image :img="c"
													:width="(70 / 12 * (item.imgs.length>2 ? 4 :6))+'vw'"
													:height="(70 / 12 * (item.imgs.length>2 ? 4 :6))+'vw'"
													@click.native="preview(item.imgs,c)" :bgColor="'#161324'" />
											</u-col>
										</u-row>
									</view>
								</view>
							</view>
						</view>
					</item-box>
				</view>
			</view>
		</mescroll-body>
	</view>
</template>

<script>
	import upCallback from '@/mixins/upCallbackMixin.js'
	import userHeader from '@/components/userHeader/userHeader.vue'
	import userLevel from '@/components/userHeader/userLevel.vue'
	import star from '@/components/star/star.vue'
	export default {
		components: {
			userHeader,
			userLevel,
			star
		},
		mixins: [upCallback],
		data() {
			return {
				dataList: [],
				apiModule: 'shopApi',
				apiType: 'systemStoreComment',
				name: 'getSystemStoreComments',
				form: {}
			}
		},
		onLoad() {
			this.form.storeId = this.loginForm.storeId
		},
		methods: {
			dataListCallBack() {
				this.dataList = this.dataList.map(val => {
					const imgs = val.image.split(',') || [];
					val.imgs = imgs
					return val;
				})
			},
			singchat(item) {
				const chatName = item.hostName || item.nickname;
				const id = item.userName || item.hxUsername;
				this.$u.route({
					url: '/pages/chat/chat',
					params: {
						type: 'singleChat',
						name: chatName,
						id
					}
				})
			},
			preview(urls, current) {
				this.previewUrls(urls, current)
			},
		}
	}
</script>

<style lang="scss" scoped>
.chat-btn{
	&::after{
		content: "";
		position: absolute;
		width: 30rpx;
		height: 20rpx;
		border-radius: 2rpx;
		background-color: var(--theme-color);
		transform: skewX(35deg);
		top: 0;
		left: 4rpx;
	}
}

</style>
